<template>
	<view class="estate_box">
		<Tips/>
		<scroll-view scroll-y="true" class="scroll-Y" @scrolltolower="lower">
			<Estate @clickEstateCardEmit="clickEstateCardFun" :estateData="item" v-for="(item,index) in estateList" :key="item" :itemIndex="index"/>
			<view class="load_box">
				<uni-load-more :content-text="contentText" iconType="circle" :color="primary_hot_color" :status="loadingStatus" />
			</view>
			<view v-if="!estateList.length">
				<MyNull img="nullEstate.png"/>
			</view>
		</scroll-view>
		<view class="add_estate" @click="toAddEstate">
			<MyIcons size="130rpx" :src="joinSystemPath('addNotice.png')"/>
		</view>
		<MyPopub height="calc(50vh)" :isOpenPopub="openPopubFlagByEstateInfo" :slotsNums="1">
			<template #1>
				<EstateInfo
					@deleteEstateEmit="isDeleteEstateFun"
					@editorEstateEmit="editorEstateFun"
					@openBillFlagFunEmit="openBillFlagFun"
					:estateInfo="chooseEstate"
					v-if="chooseEstate.id"/>
			</template>
		</MyPopub>
		<MyModal :openModalFlag="modalIsDeleteEstateFlag" :okFun="submitDeleteEstateFun">
			<template #title>
				确认删除吗
			</template>
		</MyModal>
		<MyModal :openModalFlag="modalShowBillFlag" :okFun="closeBillInfoFun">
			<template #title>
				该物品绑定的账单
			</template>
			<template #content>
				<scroll-view scroll-y="true" class="bind_bill_scroll_y" @scrolltolower="lower">
					<BillInfo width="100%" :billInfo="chooseEstate.bill" :isShowBillInfo="true"/>
				</scroll-view>
			</template>
		</MyModal>
	</view>
</template>

<script setup>
	import {
		onLoad
	} from '@dcloudio/uni-app'
	import { ref } from "vue";
	
	import Estate from '@/components/Dormitory/EstateCard/EstateCard.vue'
	import MyPopub from '@/components/MyPopub/MyPopub.vue'
	import EstateInfo from '@/components/Dormitory/EstateInfo/EstateInfo.vue'
	import Tips from '@/components/Tips/Tips.vue'
	import BillInfo from '@/components/Dormitory/BillInfo/BillInfo.vue'
	import MyNull from '@/components/MyNull/MyNull.vue'
	
	import {dynamicStyleStore} from '@/stores/dynamicStyle.js'
	
	import {
		DormitoryModel
	} from '@/service/model/dormitory.js'
	import {
		joinSystemPath
	} from '@/utils/imgJoinName.js'
	
	const dynamicStyle_store = dynamicStyleStore()
	
	const dormitoryModel = new DormitoryModel()
	
	const {
		primary_main_bgc,
		primary_hot_color,
		primary_shallow_color
	} = dynamicStyle_store.dormitoryStyle
	
	const dormitoryAllId=uni.getStorageSync('homeData')
	const fromData=ref({
		limit:5,
		page:0,
		orderBy:'createAt.desc',
		user_id:''
	})
	
	const estateList=ref([])
	const loadingStatus = ref('more')
	const contentText =ref({
		contentdown: '下滑加载更多',
		contentrefresh: '加载物品中',
		contentnomore: '没有更多物品了'
	})
	const isAllowGet=ref(true)
	const init=()=>{
		fromData.value = {
			limit:5,
			page:0,
			orderBy:'createAt.desc',
			user_id:''
		}
		estateList.value = []
	}
	
	//获取所有公共物品
	const getEstateList= async()=>{
		loadingStatus.value = 'loading'
		const {data,success} = await dormitoryModel.getEstates(fromData.value,dormitoryAllId.dormitory_id)
		if(success){
			estateList.value=[...estateList.value,...data]
			if(!data.length || data.length<fromData.value.limit){
				isAllowGet.value = false
				loadingStatus.value = 'noMore'
			}else{
				loadingStatus.value = 'more'
			}
		}
	}
	
	const lower=()=>{
		if(!isAllowGet.value) return
		fromData.value.page++
		getEstateList()
	}
	
	const openPopubFlagByEstateInfo=ref(0)
	const modalIsDeleteEstateFlag=ref(0)
	const chooseEstate=ref({})
	const clickEstateCardFun=(e)=>{
		openPopubFlagByEstateInfo.value = Math.random()
		chooseEstate.value = e
	}
	const isDeleteEstateFun=()=>{
		openPopubFlagByEstateInfo.value = -Math.random()
		modalIsDeleteEstateFlag.value = Math.random()
	}
	const submitDeleteEstateFun=async()=>{
		const index = estateList.value.findIndex(item=>item.id === chooseEstate.value.id)
		const {data,success} = await dormitoryModel.deleteEstate({},chooseEstate.value.id)
		if(success){
			uni.$emit('tips',data,'success')
			if(index!==-1){
				estateList.value.splice(index,1)
				openPopubFlagByEstateInfo.value = -Math.random()
			}
		}
	}
	const editorEstateFun=()=>{
		openPopubFlagByEstateInfo.value = -Math.random()
		uni.navigateTo({
			url:`/pages/Dormitory/AddEstate/AddEstate?estate_id=${chooseEstate.value.id}`
		})
	}
	
	const toAddEstate=()=>{
		uni.navigateTo({
			url:'/pages/Dormitory/AddEstate/AddEstate'
		})
	}
	
	//公告物品关于账单
	const modalShowBillFlag=ref(0)
	const openBillFlagFun=(item)=>{
		openPopubFlagByEstateInfo.value = -Math.random()
		modalShowBillFlag.value=Math.random()
	}
	const closeBillInfoFun=()=>{
		modalShowBillFlag.value=-Math.random()
	}
	
	onLoad((opt)=>{
		init()
		getEstateList()
		nextTick(()=>{
			uni.$emit('autoShowPushScreenAd')
		})
	})
</script>

<style lang="less">
	.estate_box{
		background-color: v-bind(primary_main_bgc);
		padding: 20rpx;
		.scroll-Y{
			height: calc(97vh);
			.load_box{
				margin-bottom: 3%;
			}
		}
		.add_estate{
			width: 130rpx;
			height: 130rpx;
			position: fixed;
			bottom: 100rpx;
			right: 50rpx;
			z-index: 10;
			background-color: v-bind(primary_hot_color);
			border-radius: 100rpx;
			display: flex;
			justify-content: center;
			align-items: center;
		}
		.add_estate:hover{
			background-color: v-bind(primary_shallow_color);
		}
		.bind_bill_scroll_y{
			max-height: calc(50vh);
		}
	}
</style>
